{% extends 'base.html' %}
{% load myfilter %}

{% block title %}
<title>搜索结果</title>
{% endblock %}


{% block body %}
{% include 'header.html' %}
{% csrf_token %}
{% if query %}


<div class="row col-md-8 col-md-offset-2  cc">
<h3>搜索结果如下：</h3>

    {% for result in page.object_list %}
    <div class="col-sm-6 col-md-3">
        <div class="thumbnail">
            <video width="100%" height="100%" controls>
                <source src="/media/{{ result.object.video }}" type="video/mp4">
            </video>
            <div class="caption">
                <h3>{{ result.object.title }}</h3>
                <p>{{ result.object.info }}</p>
                <span>售价：{{ result.object.price }}</span>&nbsp&nbsp&nbsp
                <span>作者：{{ result.object.author }}</span>
                <!--标签-->
                <br>
                {% for t in result.object.tag.all %}
                <a style="text-decoration: none" href="{% url 'main:tag_page' t.id %}"><span class="label mytag ">{{ t.title }}</span></a>
                {% endfor %}
                <br>
                <br>
                <p>
                        <a class="btn btn-default" href="{% url 'main:course_details' result.object.id %}" role="button">查看详情</a>
                        {% if request.user.is_authenticated %}
                             {% if result.object|has_buy_order:request.user %}
                            <button type="button" class="btn btn-success buy{{ result.object.id }} buy" data-course-id="{{ result.object.id }}">移除购物车</button>
                            {% else %}
                            <button type="button" class="btn btn-default buy{{ result.object.id }} buy" data-course-id="{{ result.object.id }}">添加到购物车</button>
                            {% endif %}

                            {% if course|has_collection:request.user %}
                            <a class="btn"><img class="collect{{ result.object.id }}  collect   " data-course-id="{{ result.object.id }}" src="/static/img/collected.png"></a>
                            {% else %}
                            <a class="btn"><img class="collect{{ result.object.id }}  collect  "  data-course-id="{{ result.object.id }}" src="/static/img/collect.png"></a>
                            {% endif %}
                         {% else %}
                         <button type="button" class="btn btn-default buy{{ result.object.id }} buy" data-course-id="{{ result.object.id }}">添加到购物车</button>
                         <a class="btn"><img class="collect{{ result.object.id }}  collect  "  data-course-id="{{ result.object.id }}" src="/static/img/collect.png"></a>

                        {% endif %}

                </p>
            </div>
        </div>
    </div>
    {% empty %}
    <p>啥也没找到</p>
    {% endfor %}
</div>

{% endif %}
{% include 'footer.html' %}
{% endblock %}
{% block js %}
<script>
    $(function(){
            $(".collect").click(function () {
                const courseId = $(this).data('course-id');
                console.log(courseId)
                //  获取书id
                $.ajax({

                    url: "/operation/change_collect/",
                    method: "post",
                    //  制作post  发送的信息
                    data:{
                        "csrfmiddlewaretoken":$('[type="hidden"]').val(),
                        "course_id": courseId
                    },
                    success:function(data){
                        if(data.data.state){
                            console.log("取消收藏")

                            $(`.collect${courseId}`).attr("src", "/static/img/collect.png");


                        }
                        else{
                            console.log("收藏成功")
                            $(`.collect${courseId}`).attr("src", "/static/img/collected.png");

                        }
                    }
                });
            }
            )
        })



     $(function(){
            $(".buy").click(function () {
                const courseId = $(this).data('course-id');
                console.log(courseId)
                $.ajax({

                    url: "/operation/buy_order_change/",
                    method: "post",
                    //  制作post  发送的信息
                    data:{
                        "csrfmiddlewaretoken":$('[type="hidden"]').val(),
                        "course_id": courseId
                    },
                    success:function(data){
                        if(data.data.state){
                            console.log("取消收藏")
                            $(`.buy${courseId}`).removeClass("btn-success");
                            $(`.buy${courseId}`).html("添加到购物车")
                        }
                        else{
                            console.log("收藏成功")
                            $(`.buy${courseId}`).addClass("btn-success");
                            $(`.buy${courseId}`).html("移除购物车");

                        }
                    }
                });
            }
            )
        })
</script>
{% endblock %}